import json from '../assets/json/data.json'
import '../assets/css/style.less'
import logo from '../assets/img/logo.jpeg'
// import form from './form.js'
// console.log(form)
import {
  _div,
  _btn,
  _append,
  _remove,
  _input,
  _list,
  _listItem,
  _select
} from '../ui/index.js'

// import logo from 'src/assets/logo.jpeg'
// import webpack from './webpack.png'
// import printMe from './print.js';
// import { cube } from './math.js';

let hi = _div("hi webpack", {
  class: 'red'
})
let btn = _btn("say hi", {
  class: 'red'
}, {
  click: (e) => {
    console.log(this, e)
    _append(hi, "!")
    _append(hi, _btn("hehe", {}, () => {
      alert("hehe")
    }))
    _append(hi, ["hehe", "---", _btn("dede", {
      class: 'red'
    }, (e) => {
      alert(e.target.innerText)
    })])
  }
})
let backBtn = _btn("back", {
  class: 'blue'
}, {
  click: (e) => {
    console.log(hi.childNodes)
    _remove(hi, "last")
  }
})
let list = _list("list")
let searchBtn = _btn('search', {
  class: 'green',

}, (e) => {
  debugger
  _append(hi, box.value)

})
let box = _input("hi", {
  class: 'green'
})
let addListBtn = _btn("addList", {
  class: 'yellow'
}, (e) => {
  list.appendChild(_listItem(box.value))
})
let img = new Image()
img.src = logo


let select =_select('sh',{
  options:[{
    label:'bj',
    value:'bj'
  },{
    label:'sh',
    value:'sh'
  },{
    label:'sz',
    value:'sz'
  }]
})

let content = _div([img, json, hi, btn, box, searchBtn, backBtn, addListBtn, list,select,'end'], {
  class: 'content'
})
let app = document.getElementById("app")
app.appendChild(content)